<template>
  <view class="city">
    <!-- nav导航 -->
    <nav-bar>
      <text slot="left" class="iconfont icon-fangdajing"></text>
      <view slot="center" class="nav-center">
        <text class="nav-item" @click="toIndex">推荐</text>
        <text class="nav-item activeClass">同城</text>
      </view>
    </nav-bar>
    <city-content></city-content>
    <!-- 底部tab -->
    <tab-bar class="tabbar-class" currentIndex="0"></tab-bar>
  </view>
</template>

<script>
import CityContent from '../../components/content/city/CityContent.vue'
export default {
  components: { CityContent },
  data() {
    return {}
  },
  methods: {
    toIndex() {
      uni.switchTab({ url: '/pages/index/index' })
    }
  }
}
</script>

<style lang="scss" scoped>
.city {
  height: 100vh;
  background: #2c405a;
}
.icon-fangdajing,
.icon-tuijian2 {
  font-size: 40rpx;
  color: gray;
}
.nav-center {
  display: flex;
  width: 55%;
  height: 100%;
  .nav-item {
    flex: 1;
    text-align: center;
    line-height: 64rpx;
    color: gray;
  }
}
.activeClass {
  color: #fff !important;
}
::v-deep .tab-bar-container {
  background: black !important;
}
</style>
